<template>
	<view class="ITEM" @click="router.push({
					path: '/pages/index/Form/index',query:{id:info.id} })">
		<view class="top">
			<view class="title">{{info.deptName}} -- </view>
			<view class="title-PL">
				<dict-tag :options="plantMainList" :value="info.name" />
			</view>
		</view>

		<view class="info">
			<view class="info-item">
				<span class="label">农资投入量：</span>{{info.agriculturalUseNum}}
			</view>
			<view class="info-item">
				<span class="label">化肥销售量：</span>{{info.agriculturalSaleNum}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		dicts: ['nongzi'],
		components: {},
		props: {
			info: {
				type: Object,
				default: () => {
					return {}
				}
			}
		},
		data() {
			return {
				plantMainList: []
			}
		},
		watch: {},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		created() {
			this.getTypeList()
		},
		onLoad(options) {},
		onShow() {},
		methods: {
			async getTypeList() {
				let res = await this.$api.listGoods({
					pageNum: 1,
					pageSize: 10000,
					categoryId: 'ltpivjjw-1d3ufgyz-hsuwll-0000001',
				})
				this.plantMainList = res.data.rows
			},
		}
	}
</script>

<style lang="scss" scoped>
	.ITEM {
		width: 100%;
		height: 200rpx;
		margin: 20rpx 0;
		// background-color: #f7f7f7;
		border: 1rpx solid #dddddd;
		border-radius: 20rpx;
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		box-shadow: 2px 2px 5px #dddddd;


		.top {
			display: flex;
			align-items: center;
		}

		.title {
			font-size: 36rpx;
			font-weight: 700;
			color: #333;
		}

		.title-PL {
			font-weight: 700;
			font-size: 32rpx;
			color: #666;
			margin-left: 10rpx;
		}

		.info {
			display: flex;
			justify-content: space-between;
			align-items: center;
			color: #ffaa00;

			.info-item {
				flex: 1;

				.label {
					font-weight: 700;
					color: #999;
				}
			}
		}
	}
</style>